<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../vue.js"></script>
</head>
<body>

<div id="app">
    <eclick></eclick>
    <eclick></eclick>
    <eclick></eclick>
    <br>
    <cclick></cclick>
    <cclick></cclick>
    <cclick></cclick>
    <cclick></cclick>
</div>




<script>
    var data = {count : 1}

    // 这个代码要在newVue的上面
    Vue.component('eclick', {
        template: '<button v-on:click="count += 1">{{count}}</button>',
        data: function () {
            return data
        }
    })

    Vue.component('cclick', {
        template: '<button v-on:click="count += 1">{{count}}</button>',
        data: function () {
            return {count : 0};
        }
    })

    new Vue({
        el: "#app"
    });

</script>


</body>
</html>